// pages/bad_perf/too_much_image.js
const currentPagePath = 'pages/bad_perf/skeleton/test-skeleton'
let importtime = Date.now()
let fcp
let lcp
let fr
let loadtime
let readytime
let navtime
function printInfo() {
  // 打印各个时间的关系
  const arr = [{
      time: fcp,
      desc: "firstContentfulPaint"
    },
    {
      time: lcp,
      desc: "largestContentfulPaint"
    },
    {
      time: fr,
      desc: "firstRender"
    },
    {
      time: readytime,
      desc: "onReady"
    },
    {
      time: navtime,
      desc: "navigation"
    },
  ]
  const info = arr.filter(v => v.time).sort((a, b) => a.time - b.time)
  let msg = ""
  if (info.length > 1) {
    for (let i of info) {
      if (i === info[0]) {console.debug(`${i.desc}最早到达, ${i.time}`); msg += `${i.desc}最早到达, ${i.time}\n`}
      else {console.debug(`${i.desc}比${info[0].desc}迟${i.time - info[0].time}ms到达`); msg += `${i.desc}比${info[0].desc}迟${i.time - info[0].time}ms到达\n`}
    }
  }
  return msg + "----------------\n"
}
let currentpage = undefined
const performance = wx.getPerformance()
const observer = performance.createObserver((entryList) => {
  const a = entryList.getEntriesByName("firstContentfulPaint", )[0]
  const b = entryList.getEntriesByName("largestContentfulPaint")[0]
  const c = entryList.getEntriesByName("firstRender")[0]
  const d = entryList.getEntriesByName("route")[0]
  if (a && a.path === currentPagePath && (a.startTime > fcp || !fcp)) {
    console.log(a)
    fcp = a.startTime
  }
  if (b && b.path === currentPagePath && (b.startTime > lcp || !lcp)) {
    console.log(b)
    lcp = b.startTime;
    console.warn("update lcp", lcp, readytime ? lcp - readytime : 0, lcp - fr)
  }
  if (c && c.path === currentPagePath) {console.log("fr", c);fr = c.startTime}
  if (d && d.path === currentPagePath) {console.log("navigate", d);navtime = d.navigationStart || d.startTime}
  const msg = printInfo()
  if (currentpage) currentpage.info += msg
})
observer.observe({
  entryTypes: ['render', 'navigation']
})

Page({

  /**
   * 页面的初始数据
   */
  data: {
    images: []
  },

  info: "",

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
    setTimeout(() => {
      this.setData({
        data: this.info
      })
    }, 5000)
    currentpage = this
    this.info = ""
    loadtime = Date.now()
    console.warn("load after", loadtime - importtime, loadtime, )
    const images = []
    const setImage = () => {
      this.setData({
        images
      }, () => {
        console.log("set images success")
        this.info += printInfo()
      })
    }
    setTimeout(() => {
      images.push(`https://minitest.weixin.qq.com/minium/resources/9420.png?t=1`)
      setImage()
      images.push(`https://minitest.weixin.qq.com/minium/resources/winerror100421.png?t=1`)
      setTimeout(() => {
        setImage()
        for (let i = 0; i < 20; i++) {
          images.push(`https://minitest.weixin.qq.com/minium/resources/9420.png?t=${i+200}`)
          images.push(`https://minitest.weixin.qq.com/minium/resources/winerror100421.png?t=${i+200}`)
        }
        setTimeout(() => {
          setImage()
        }, 1000)
      }, 1000)
    }, 1000)

  },

  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady: function () {
    readytime = Date.now()
    console.warn("onready", readytime, readytime - loadtime)
    this.info += printInfo()
  },

  /**
   * 生命周期函数--监听页面显示
   */
  onShow: function () {

  },

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide: function () {

  },

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload: function () {
    fcp = undefined
    lcp = undefined
    fr = undefined
    loadtime = undefined
    readytime = undefined
    navtime = undefined
    currentpage = undefined
  },

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh: function () {

  },

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom: function () {

  },

  /**
   * 用户点击右上角分享
   */
  onShareAppMessage: function () {

  }
})